<template>
    <div class="nav-box"
        v-tab-current="{
            curInd:tabIndex,
            itemName:'nav-item',
            curName:'on'
        }">
        <navItem v-for="(item,index) in navData" :key="index"
            :index="index"
            :item="item">
        </navItem>
    </div>
</template>
<script>
    import navItem from "./nav-item";
    import {mapState} from "vuex";
    import {tabCurrent} from "@/directives";
    export default {
        name:"navBox",
        components:{navItem},
        props:{
            navData:Array,
            // creInd:Number
        },
        computed:{
           ...mapState(['tabIndex'])
        },
        directives:{
            tabCurrent
        },
        data(){
            return{}
        },
        methods:{
            // clickNavItem(...arg){
            //     this.$emit("clickNavItem",...arg);
            // }
        }
    }
</script>

<style scoped>
    .nav-box{
        height: 50px;
        line-height: 50px;
        width: 100%;
        border-bottom: 1px solid #aaa;
        display: flex;
        justify-content: center;
    }
</style>
